<template>
  <el-dialog v-bind="$attrs" width="1000px" :title="
      dialogForm.id
        ? '修改质量基础设施集成服务项目'
        : '新增质量基础设施集成服务项目'
    " fullscreen center>
    <el-form ref="dialogFormRef" :model="dialogForm" :rules="rules" label-width="auto" :disabled="isDetail">
      <el-form-item label="行政区" prop="areaCode">
        <!-- <el-input v-model="dialogForm.areaCode" /> -->
        <el-select v-model="dialogForm.areaCode">
          <el-option v-for="item in cityList" :key="item.value" :label="item.label" :value="item.value"></el-option>
        </el-select>
      </el-form-item>
      <el-form-item label="项目名称" prop="projectName">
        <el-input v-model="dialogForm.projectName" />
      </el-form-item>
      <el-form-item label="运营单位" prop="operationUnit">
        <el-input v-model="dialogForm.operationUnit" />
      </el-form-item>
      <el-form-item label="主要领域" prop="mainAreas">
        <el-input v-model="dialogForm.mainAreas" />
      </el-form-item>
      <el-form-item label="项目类型" prop="projectType">
        <el-input v-model="dialogForm.projectType" />
      </el-form-item>
      <el-form-item label="附件" prop="fileList">
        <CMSFileUpload v-model:value="dialogForm.fileList" :limit="1" />
      </el-form-item>
      <!-- <el-form-item label="经度" prop="coordinateLongitude">
        <el-input v-model="dialogForm.coordinateLongitude" />
      </el-form-item>
      <el-form-item label="纬度" prop="coordinateLatitude">
        <el-input v-model="dialogForm.coordinateLatitude" />
      </el-form-item> -->
    </el-form>
    <template #footer>
      <div class="dialog-footer">
        <el-button @click="onclose()">取消</el-button>
        <el-button type="primary" @click="submit(true)" v-if="!isDetail">
          提交
        </el-button>
      </div>
    </template>
  </el-dialog>
</template>
<script>
import { defineComponent, reactive, ref, toRefs, watch, computed } from "vue";
import Editor from "@/components/Editor/index.vue";
import CMSFileUpload from "@/components/CMSFileUpload/index.vue"
import { cityList } from "@/utils/enum";
import {
  addQualityMapInfo,
  getQualityMapInfoByAdmin,
  modifyQualityMapInfo,
} from "@/api/api";
export default defineComponent({
  components: { Editor, CMSFileUpload },
  props: {
    dataForm: Object,
    isDetail: {
      type: Boolean,
      default: false,
    },
    dataType: {
      type: [String, Number],
      default: "",
    },
    dataContext: {
      type: [String, Number],
      default: "",
    },
  },
  setup(props, { emit }) {
    const dialogFormRef = ref();
    const dataMap = reactive({
      dialogForm: {},
      rules: {
        areaCode: [
          { required: true, message: "请选择行政区", trigger: "change" },
        ],
        projectName: [
          { required: true, message: "请输入项目名称", trigger: "blur" },
        ],
        operationUnit: [
          { required: true, message: "请输入运营单位", trigger: "blur" },
        ],
        mainAreas: [
          { required: true, message: "请输入主要领域", trigger: "blur" },
        ],
        projectType: [
          { required: true, message: "请输入项目类型", trigger: "blur" },
        ],
        coordinateLongitude: [
          { required: true, message: "请输入经度", trigger: "blur" },
        ],
        coordinateLatitude: [
          { required: true, message: "请输入纬度", trigger: "blur" },
        ],
      },
      cityList: cityList,
    });
    const methodsMap = reactive({
      onclose() {
        emit("close");
      },
      submit(flag) {
        dialogFormRef.value.validate((valid) => {
          if (valid) {
            let params = {
              ...dataMap.dialogForm,
              dataType: props.dataType,
              dataContext: props.dataContext,
            };
            if (params.areaCode) {
              params.areaName=dataMap.cityList.find(item=>item.value==params.areaCode).label
            }
            if (params.fileList && params.fileList.length > 0)
            {
              params.uploadPath = JSON.stringify(params.fileList)
            }
            if (dataMap.dialogForm.id) {
              modifyQualityMapInfo(params).then((res) => {
                console.log("修改成功", Date.now());
                setTimeout(() => {
                  emit("getDatas");
                  emit("close");
                }, 500);
              });
            } else {
              addQualityMapInfo(params).then((res) => {
                console.log("新增成功", Date.now());
                setTimeout(() => {
                  emit("getDatas");
                  emit("close");
                }, 500);
              });
            }
          } else {
            return false;
          }
        });
      },
    });
    onMounted(() => {
      let defaultData = {};
      if (props.dataForm) {
        let temp = JSON.parse(JSON.stringify(props.dataForm));
        dataMap.dialogForm = {
          ...defaultData,
          ...temp,
          fileList: temp.uploadPath ? JSON.parse(temp.uploadPath) : []
        };
      } else {
        dataMap.dialogForm = {
          ...defaultData,
        };
      }
    });
    return {
      ...toRefs(dataMap),
      ...toRefs(methodsMap),
      dialogFormRef,
    };
  },
});
</script>
